<template>
  <a-card style="">
      <div v-for="formItem in descInfo" :key="formItem.title">
          <p style="text-align: center; font-weight: 700">{{ formItem.title }}</p>
          <a-form :label-col="{ span: 10 }" :wrapper-col="{ span: 14 }">
              <a-form-item v-for="item in formItem.items" :key="item.key" :label="item.name" :name="item.key">
                  <a-input :disabled="isDisabled" v-model:value="item.value" @change="changeFn"/>
              </a-form-item>
          </a-form>
      </div>
  </a-card>
</template>

<script>
export default {
  props: {
      isDisabled: {
          type: Boolean,
          default: false,
      },
      descInfo: {
          type: Array,
          default: () => [
              {
                  title: String,
                  item: () => [],
              },
          ],
      },
  },
  methods: {
    changeFn(e) {
        console.log(this.descInfo)
    }
  }
};
</script>
